import React from "react";
import { useTheme } from "@mui/material";

function MobileIcon() {
  const theme = useTheme();
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width="76" height="60">
      <g fill="none" fillRule="evenodd">
        <path
          fill={theme.palette.button.darkest}
          d="M75.696 28.442C77.522 15.132 60.176 3.077 49.08.847 38.054-1.383 20.393.045 8.63 14.295-3.166 28.513-1.061 46.838 4.276 52.063c5.337 5.225 10.67 5.15 18.927.244 8.25-4.913 21.417-6.9 36.69-7.91 15.312-.975 15.803-15.955 15.803-15.955"
        ></path>
        <path
          fill={theme.palette.success.light}
          d="M50.6 59.479H23.671c-2.247 0-4.069-1.808-4.069-4.037V4.616c0-2.23 1.822-4.038 4.07-4.038h26.926c2.247 0 4.069 1.808 4.069 4.038v50.826c0 2.23-1.822 4.037-4.069 4.037"
        ></path>
        <path
          fill={theme.palette.shades.contrastText}
          d="M51.856 59.479H24.929c-2.247 0-4.069-1.808-4.069-4.037V4.616c0-2.23 1.822-4.038 4.069-4.038h26.927c2.247 0 4.069 1.808 4.069 4.038v50.826c0 2.23-1.822 4.037-4.07 4.037"
        ></path>
        <path
          fill={theme.palette.common.whites}
          d="M51.677 52.123H24.562c-.585 0-1.06-.471-1.06-1.052V7.968c0-.58.475-1.052 1.06-1.052h27.115c.585 0 1.06.471 1.06 1.052v43.103c0 .58-.475 1.052-1.06 1.052"
        ></path>
        <path
          fill={theme.palette.shades.lightest}
          d="M34.563 56.295h6.878v-1.063h-6.878zm2.298-51.782h6.878V3.449h-6.878zm-1.599-.475c0 .37-.302.67-.675.67a.673.673 0 01-.675-.67c0-.37.302-.67.675-.67.373 0 .675.3.675.67"
        ></path>
        <path
          fill={theme.palette.shades.darkest}
          d="M46.7 27.648c0 4.679-3.822 8.472-8.537 8.472-4.716 0-8.538-3.793-8.538-8.472 0-4.678 3.822-8.47 8.538-8.47 4.715 0 8.537 3.792 8.537 8.47"
        ></path>
        <path
          fill={theme.palette.shades.contrastText}
          d="M40.511 24.343a2.34 2.34 0 01-2.348 2.33 2.34 2.34 0 01-2.349-2.33 2.34 2.34 0 012.349-2.33 2.34 2.34 0 012.348 2.33m1.584 8.942H34.23V31.09c0-2.155 1.76-3.902 3.933-3.902 2.171 0 3.932 1.747 3.932 3.902v2.195z"
        ></path>
        <path
          fill={theme.palette.success.light}
          d="M38.163 38.642a2.532 2.532 0 01-2.543-2.522 2.532 2.532 0 012.543-2.523 2.532 2.532 0 012.542 2.523 2.532 2.532 0 01-2.542 2.522z"
        ></path>
        <path
          fill={theme.palette.common.white}
          d="M36.808 35.811h1.043v-1.035h.623v1.035h1.043v.618h-1.043v1.034h-.623v-1.034h-1.043z"
        ></path>
      </g>
    </svg>
  );
}

export default MobileIcon;
